<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Configure URL</title>
<script src="./js/jquery-1.7.js"></script>
<style type="text/css">
	body {
		background: #E5ECF4 url('./img/bg.png') repeat-x;
	}
	
	label {
		display: inline-block;
		width: 150px;
	}
	
	.logo {
		width: 750px;
		height: auto;
		margin-left: auto;
		margin-right: auto;
		margin-top: 30px;
	}
	
	.container {
		border: 1px solid #ccc;
		width: 750px;
		height: auto;
		margin-left: auto;
		margin-right: auto;
		margin-top: 30px;
		padding-top: 10px;
		background-color:#fff;
	}
	
	.title {
		margin-left: 20px;
		font-size: 1.1em;
		font-weight: bold;
		font-style: italic;
		border-bottom: 1px dashed #CCC;
		margin-bottom: 20px;
	}
	
	.titleLabel {
		width: 200px;
	}
	
	.row {
		margin-top: 5px;
		margin-left: 20px;
	}
	
	#statusTip {
		width: 400px;
		color: green;
		font-weight: bold;
		font-size: 1em;
	}
	
	.buttonRow {
		margin-top: 10px;
		margin-left: 20px;
		margin-bottom: 20px;
	}
	
	.bt {
		width: 70px;
	}
</style>
<script type="text/javascript">
	$(function(){
		var oldUrl = $("#oldUrl").val();
		var bbanUrl = $("#bbanUrl").val();
		var ibanUrl = $("#ibanUrl").val();
		
		$("#editBt").click(function(){
			if($(this).text()=="Edit") {
				$(this).text("Save");
				$("#statusTip").text("");
				$(".field").removeAttr("disabled");
			}
			else {// save changes
				$.post("admin?action=write", 
						{"oldwebserviceurl":escape($("#oldUrl").val()), "bbanwebserviceurl":escape($("#bbanUrl").val()), "ibanwebserviceurl":escape($("#ibanUrl").val())},
						function(data){
							
							if(data=="success") {
								$("#statusTip").css("color", "green");
								$("#statusTip").text("Saved sucessfully!");
								
								oldUrl = $("#oldUrl").val();
								bbanUrl = $("#bbanUrl").val();
								ibanUrl = $("#ibanUrl").val();
							}
							else {
								$("#statusTip").css("color", "red");
								$("#statusTip").text("Save failed!");
							}
						});
				
				$(this).text("Edit");
				$(".field").attr("disabled", "disabled");
			}
		});
		
		$("#cancelBt").click(function(){
			$("#oldUrl").val(oldUrl);
			$("#bbanUrl").val(bbanUrl);
			$("#ibanUrl").val(ibanUrl);
			$("#editBt").text("Edit");
			$(".field").attr("disabled", "disabled");
		});
	});
</script>
</head>
<body>
	<%
		String oldUrl = request.getParameter("oldwebserviceurl");
		String bbanUrl = request.getParameter("bbanwebserviceurl");
		String ibanUrl = request.getParameter("ibanwebserviceurl");
	%>
	<div class="logo">
		<img alt="logo" src="./img/logo.gif">
	</div>
	<div class="container">
		<div class="title">
			<label class="titleLabel">Set WebService URL</label>
		</div>
		<div class="row">
			<label for="Old Service URL">Old&nbsp; Service URL</label> <input
				type="text" name="oldUrl" size="70" class="field" id="oldUrl" disabled="disabled" value="<%=oldUrl%>"/>
		</div>
		<div class="row">
			<label for="Bban Service URL">Bban Service URL</label> <input
				type="text" name="bbanUrl" size="70" class="field" id="bbanUrl" disabled="disabled" value="<%=bbanUrl%>"/>
		</div>
		<div class="row">
			<label for="Iban Service URL">Iban Service URL</label> <input
				type="text" name="ibanUrl" size="70" class="field" id="ibanUrl" disabled="disabled" value="<%=ibanUrl%>"/>
		</div>
		<div class="row">
			<label id="statusTip">Click "Edit" Button to Edit URLs</label>
		</div>
		<div class="buttonRow">
			<button type="button" name="editSave" class="bt" id="editBt">Edit</button>
			<button type="button" name="cancel" class="bt" id="cancelBt">Cancel</button>
		</div>
	</div>
</body>
</html>